<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>项目管理</title>
    <link rel="stylesheet" href="${base}/layui/css/layui.css">
    <style>
    	.layui-bg-black{width: 200px;height: 136px;margin-right: 30px;float: left;text-align: center;font-size: 33px;color: #000000!important;padding-top: 30px;}
    	.layui-table th{background: #009688;color: #fff;}
    	table td td{ text-align: center;}    
    </style>
</head>
<body  class="layui-layout-body">
<#include "/common/left.flt">	
<div class="layui-main" style="position: absolute;left: 300px;top: 50px;" >
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
  <legend>操作提示</legend>
</fieldset>
   
<blockquote class="layui-elem-quote layui-quote-nm">
 	<div class="layui-input-inline">
 		<button class="layui-btn" id="add" ><img alt="" src="${base}/images/addto.png" width="16px" height="16px" /> 新加</button>
 		<button class="layui-btn" id="del"><img alt="" src="${base}/images/delete.png" width="16px" height="16px" /> 删除</button>
 	</div>
</blockquote> 

<table class="layui-table-box layui-table" id="table" style=" width: 100%;margin-top: 60px;">
	 <tr>
    	<th >账号</th>
        <th >真实姓名</th>
        <th >手机</th>
        <th >密码</th>
        <th >角色</th>
        <th >操作</th>
     </tr>
     <#list dataList as one>
     <tr >
     	<td class="layui-table-cell" style="text-align: left;font-size: 16px;padding: 5px 0px;"><input type="checkbox" name="id" value="${one.id}" /> ${one.account}</td>
     	<td class="layui-table-cell" style="text-align: left;font-size: 16px;padding: 5px 0px;">${one.name}</td>
     	<td class="layui-table-cell" style="text-align: left;font-size: 16px;padding: 5px 0px;">${one.mobile}</td>
     	<td class="layui-table-cell" style="text-align: left;font-size: 16px;padding: 5px 0px;">${one.password}</td>
     	<td class="layui-table-cell" style="text-align: left;font-size: 16px;padding: 5px 0px;">${one.role}</td>
     	<td class="layui-table-cell" style="text-align: left;font-size: 16px;padding: 5px 0px;"><a onclick="show('${one.id}','${one.account}','${one.name}','${one.mobile}','${one.password}','${one.role}');"><img src="${base}/images/modify.png" width="20px" height="20px" /> 修改</a></td>
     </tr>
     </#list>
</table>
</div>
</body>
<script src="${base}/js/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="${base}/layui/layui.all.js"></script>
<script type="text/javascript">
$("#add").click(function(){
	layer.open({
	    type: 1
	    ,id: 'layer1' //防止重复弹出
	    ,area:['400px', '420px']
	    ,content: '<div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">账号</label><input type="text" name="account" id="account"  placeholder="请输入账号"  class="layui-input" style="width: 200px;"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">真实姓名</label><input type="text" name="name" id="name"  placeholder="请输入真实姓名"  class="layui-input" style="width: 200px;"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">手机</label><input type="text" name="mobile" id="mobile"  placeholder="请输入手机"  class="layui-input" style="width: 200px;"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">密码</label><input type="text" name="password" id="password"  placeholder="请输入密码"  class="layui-input" style="width: 200px;"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">角色</label><select name="role" id="role" class="layui-input" style="width: 200px;"><option value="医生">医生</option><option value="学生">学生</option><option value="研究员">研究员</option></select></div>'
	    ,btn: '确定'
	    ,btnAlign: 'c' //按钮居中
	    ,shade: 0 //不显示遮罩
	    ,yes: function(){
	    	var name = $("#name").val();
	    	var account = $("#account").val();
	    	var mobile = $("#mobile").val();
	    	var password = $("#password").val();
	    	if (password.length < 8){
	    		layer.alert("密码至少8位");
	    		$("#password").focus();
	    		return;
	    	}
	    	var role = $("#role").val();
	        $.post("${base}/index/userAdd",
	        		{"name":name,"account":account,"password":password,"mobile":mobile,"role":role},function(data){ 
	        			layer.alert(data);
	        			window.location.reload();
	        		}
	        );
	    }
	});
});

function show(id,account,name,mobile,password,role){
	layer.open({
	    type: 1
	    ,id: 'layer1' //防止重复弹出
	    ,area:['400px', '420px']
	    ,content: '<div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">账号</label><input type="text" name="account" id="account"  placeholder="请输入账号" value=\"'+account+'\" class="layui-input" style="width: 200px;"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">真实姓名</label><input type="text" name="name" id="name"  placeholder="请输入真实姓名"  class="layui-input" style="width: 200px;" value="'+name+'"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">手机</label><input type="text" name="mobile" id="mobile"  placeholder="请输入手机"  class="layui-input" style="width: 200px;" value="'+mobile+'"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">密码</label><input type="text" name="password" id="password"  placeholder="请输入密码"  class="layui-input" style="width: 200px;" value="'+password+'"></div><div class="layui-input-inline" style="margin-top: 10px;"><label class="layui-form-label">角色</label><select name="role" id="role" class="layui-input" style="width: 200px;"><option value="医生">医生</option><option value="学生">学生</option><option value="研究员">研究员</option></select></div>'
	    ,btn: '确定'
	    ,btnAlign: 'c' //按钮居中
	    ,shade: 0 //不显示遮罩
	    ,yes: function(){
	    	var name = $("#name").val();
	    	var account = $("#account").val();
	    	var mobile = $("#mobile").val();
	    	var password = $("#password").val();
	    	var role = $("#role").val();
	        $.post("${base}/index/userUpdate",
	        		{"id":id,"name":name,"account":account,"password":password,"mobile":mobile,"role":role},function(data){ 
	        			layer.alert(data);
	        			window.location.reload();
	        		}
	        );
	    }
	});
	$("#role").val(role);
}
$("#del").click(function (){
	var values = "";
	var i = 0;
	$("input[name='id']").each(function(){
		if ($(this).is(':checked')){
			values = values + $(this).attr("value") +",";
			i = i + 1;
		}
	});
	if (i > 0){
		$.post("${base}/index/userDel",
        		{"ids":values},function(data){ 
        			layer.alert(data);
        			window.location.reload();
        		}
        );
	} else {
		layer.msg("没有选择记录！");
	}
});

</script>
</html>